<template>
	<view class="box">
		<view class="box-item">
			收件人 <input v-model="shoujian" class="right" type="text" placeholder="请输入收件人姓名" />
		</view>
		<view class="box-item">
			电话号码 <input v-model="phone" class="right" type="text" placeholder="请输入收件人电话号码" />
		</view>
		<view class="box-item">
			<!-- 收货地址 -->
			所在地区 <view v-if="currten == true"  class="right">{{address}}</view><view @tap="open" class="right" v-else>请点击选择地址</view>
			<!-- <button type="mini"@tap="open" class="right" >请点击选择地址</button> -->
			<simple-address ref="simpleAddress" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onConfirm"
				themeColor="#007AFF"></simple-address>
		</view>
		<view class="box-item">
			详细地址<input v-model="newaddress"  class="right" type="text" placeholder="输入详细地址" />
		</view>
		<view class="box-item">
			设置默认地址 <async-switch :checked="checked1" @change="change1"></async-switch>
		</view>
		<view class="bottom" @tap="storage">保存地址</view>
	</view>
</template>

<script>
	import{
		addAddressInfo
	}from "@/api/cart/address/index.js"
	import asyncSwitch from "@/components/helang-asyncSwitch/helang-asyncSwitch.vue"
	import simpleAddress from '@/components/simple-address/simple-address.vue';
	export default {

		data() {
			return {
				cityPickerValueDefault: [0, 0, 1],
				checked1: false,
				shoujian:"糊涂",
				phone:"",
				address:"",
				currten:false,
				newaddress:"",
				 default:0,
				 city:""
				
			};
		},
		components: {
			simpleAddress,
			"async-switch": asyncSwitch
		},
		methods: {
			// 发送保存地址请求
			storage(){
				addAddressInfo({
					
					  "city": "string",
					  "cityCode": "string",
					  "createTime": "2021-06-07T09:19:06.176Z",
					  "defaultStatus": 0,
					  "detailAddress": "string",
					  "id": "string",
					  "memberId": "string",
					  "modifyTime": "2021-06-07T09:19:06.176Z",
					  "name": "string",
					  "phoneNumber": "string",
					  "postCode": "string",
					  "province": "string",
					  "region": "string",
					  "tag": "string"
				})
			},
			open() {
				this.$refs.simpleAddress.open();
				
				
			},
			onConfirm(e) {
				console.log(e)
				this.city = e.labelArr[1]
				console.log(this.city)
				this.address = e.label
				this.currten = true
				
				
			},
			change1() {
				this.checked1 = !this.checked1;
				if(this.checked1 == true){
					this.default = 1
				}else{
					this.default = 0
				}

			}
		},
	}
</script>

<style lang="scss" scoped>
	.box-item {
		display: flex;
		justify-content: space-between;
		height: 60px;
		line-height: 60px;
		font-size: 15px;
		width: 90%;
		margin: 0 auto;
		border-bottom: 1px #000000 solid;

		.right {
			width: 250px;
			height: 100%;

		}
	}
	.bottom{
		width: 70%;
		height: 40px;
		border-radius: 16px;
		line-height: 40px;
		
		background-color: #354E44;
		text-align: center;
		color: #FFFFFF;
		position: fixed;
		bottom: 50px;
		left: 15%;
	}
</style>
